var mNavBox ;
var mListBox;
var curRegion = '';
function init(){
	if(document.persisted) {
		return false;
	}
	
	mNavBox = new UlListBox({target:'nav',disNum:6,onclick:onclickTypeListener,onfocus:onfocusTypeListener,onblur:onblurTypeListener});
	mListBox = new UlListBox({
		target:'list',
		content:'pUlListContentBox',
		focusClass:'_curLiList',
		normalClass:'_liList',
		disNum:3,
		liStartLeft:-260,
		liItemWidth:260,
		onclick:onclickListListener,
		onfocus:onfocusListListener,
		onblur:onblurListListener,
		formatHtml:formatListHtml,
	});
	
	initData(afterInitData);
}

function afterInitData(){
	mNavBox.setDataList(typeList,true);
	var a = document.getElementById(mNavBox.target+'-a-1');
	a.click();
}


function onclickTypeListener(type,tar){
	mListBox.setDataList(type.dataList,false);
	var topBox = document.getElementById('topBox');
	topBox.innerHTML = type.name;
}

function onfocusTypeListener(data,tar){
	var icon = document.getElementById(mNavBox.target+'-icon-'+tar); 
	icon.innerHTML = '<img src="'+data.highImage+'"/>'; 
	
	curRegion = 'nav';
}

function onblurTypeListener(data,tar){
	var icon = document.getElementById(mNavBox.target+'-icon-'+tar);
	icon.innerHTML = '<img src="'+data.image+'"/>';
}


function onclickListListener(data,tar){
	setSession("MOVIE_PLAY_JSON",data.toJSON());
	var url = "play/index.html?player=true";
	$.gotoPage(url);
}
function onfocusListListener(data,tar){
	
	curRegion = 'list';
}
function onblurListListener(data,tar){
	
}

function formatListHtml(data,j){
	var con = '';
	con += '<div class="_liListTitle"><a href="#" id="'+this.target+'-a-'+j+'" tar="'+j+'">'+data.name+'</a></div>';
	con += '<div class="_liListIcon" id="'+this.target+'-icon-'+j+'"><img src="'+data.icon+'"/></div>';
	con += '<div class="_liListRent">RENT</div>';
	con += '<div class="_liListDes">Price:Rp.10.000</div>';
	return con;
}
